<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
		<script src="//aui-cdn.atlassian.com/aui-adg/6.0.4/js/aui.min.js"></script>
		<script src="prism/prism.js"></script>
		<script src="prism/bililiteRange.js"></script>
		<script src="prism/bililiteRange.undo.js"></script>
		<script src="prism/bililiteRange.util.js"></script>
		<script src="prism/bililiteRange.fancytext.js"></script>
		
		<script src="connectUtils-1-4-8.js" type="text/javascript"></script>
		<script src="admin.js" type="text/javascript"></script>
		<script src="config.js" type="text/javascript"></script>
		<link rel="stylesheet" type="text/css" href="//aui-cdn.atlassian.com/aui-adg/6.0.4/css/aui.css">
		<link rel="stylesheet" type="text/css" href="prism/prism.css" />
		<style type="text/css">
			code:focus {
			  outline: none;
			}
			.upload-btn-wrapper {
			  position: relative;
			  overflow: hidden;
			  display: inline-block;
			}
			
			.upload-btn-wrapper input[type=file] {
			  font-size: 100px;
			  position: absolute;
			  left: 0;
			  top: 0;
			  opacity: 0;
			}
			table {
				border: 1px solid #eee;
			    text-align: left;
			    border-collapse: collapse;
			    border-spacing: 0;
			}
			
			table td, th{
				border: 1px solid #999;
				padding-left: 4px;
			}
		</style>
	</head>
	<body class="aui-layout aui-theme-default" style="background-color:rgb(255, 255, 255);">
		<div class="aui-tabs horizontal-tabs">
		    <ul class="tabs-menu">
		    	<li class="menu-item active-tab">
		            <a href="#configTab"><strong data-i18n="drawConfig">draw.io Configuration</strong></a>
		        </li>
		        <li class="menu-item" id="cLibTabHeader" style="display: none">
		            <a href="#cLibsTab"><strong data-i18n="customLib">Custom Libraries</strong></a>
		        </li>
		        <li class="menu-item" id="cTempTabHeader" style="display: none">
		            <a href="#cTempTab"><strong data-i18n="customTemp">Custom Templates</strong></a>
		        </li>
		        <li class="menu-item">
		            <a href="#pageIdsTab"><strong data-i18n="pageIdsExp">Page IDs Export</strong></a>
		        </li>
		        <li class="menu-item">
		            <a href="#pageIdsImportTab"><strong data-i18n="pageIdsImp">Page IDs Import</strong></a>
		        </li>
		        <li class="menu-item">
		            <a href="#reindexingTab"><strong data-i18n="drawReindex">draw.io re-indexing (Beta)</strong></a>
		        </li>
		    </ul>
		    <div class="tabs-pane active-pane" id="configTab">
		    	<br>
			    <h4 data-i18n="drawConfig">draw.io Configuration</h4>
			    <div id="busyIndicator">
			    	<img src="/images/spin.gif"> <span data-i18n="working">Working</span>...
			    </div>
			    <div id="createSpace" style="display: none;">
			    	<br>
			    	<span data-i18n="drawConfigNotFoundInst">draw.io Configuration Space (DRAWIOCONFIG) does not exist. This space is needed to store draw.io configuration files and custom libraries/templates.</span>
			    	<br>
			    	<div>
			    		<br>
			    		<button id="createConfSpaceBtn" disabled="disabled" class="aui-button aui-button-primary" data-i18n="createConfSp">Create Config Space</button>
			    	</div>
			    </div>
			    <div id="confError" style="display: none; color: #bb0000" data-i18n="unexpErrRefresh">
			    	Unexpected error, please refresh the page and try again.
			    </div>
			    <div id="manageConfig" style="display: none;">
			    	<br>
			    	<span data-i18n="configJSONInst">Write draw.io JSON configuration in the editor below then click save. If you need help, please refer to</span> <a href="https://desk.draw.io/support/solutions/articles/16000058316" target="_blank" data-i18n="thisPage">this page</a>.
			    	<br>
			    	<div id="jsonMsg">&nbsp;</div>
			    	<pre class="line-numbers language-json" style="height: 400px"><code contenteditable="true" id="configJSON" class="language-json" style="height: 100%; width: 100%; display: block"></code></pre>
			    	<div>
			    		<button id="saveConfigBtn" class="aui-button aui-button-primary" data-i18n="save">Save</button>
			    	</div>
			    </div>
		    </div>
		    <div class="tabs-pane" id="cLibsTab">
		    	<br>
			    <h4 data-i18n="curCustLib">Current Custom Libraries</h4>
			    <br>
			    <table id="curLibs" style="box-sizing: border-box; max-width: 100%">
			    	<tr>
			    		<th style="min-width: 400px" data-i18n="libName">Library Name</th>
			    		<th style="width: 47px" data-i18n="action">Action</th>
			    		<th data-i18n="drawConfID">draw.io Config ID</th>
			    	</tr>
			    </table>
		        <div><br><span data-i18n="addLibInst">Click the "Add Library" button to upload a new library.</span></div>
				<div>
					<div id="cLibMsg">&nbsp;</div>
					<div class="upload-btn-wrapper">
					  <button class="aui-button aui-button-primary" data-i18n="addLib">Add Library</button>
					  <input type="file" id="uploadLib" />
					</div>
				</div>
		    </div>
		    <div class="tabs-pane" id="cTempTab">
		    	<br>
			    <h4 data-i18n="customTemp">Custom Templates</h4>
			    <br>
		        <div>
		        	<span data-i18n="customTempInst1">Custom Templates are draw.io diagrams saved in children pages of</span> <a id="tempPageLnk" target="_blank" data-i18n="tempsPage">Templates page</a>. <br>
		        	<span data-i18n="customTempInst2">For more details, please refer to</span> <a href="https://desk.draw.io/" target="_blank" data-i18n="thisPage">this page</a>.
		        </div>
		    </div>
		    <div class="tabs-pane" id="pageIdsTab">
		    	<div><br><span data-i18n="pageIdsExpInst1">Select export target, then click the "Start Export" button to export all page IDs.</span><br>
				<span data-i18n="pageIdsExpInst2">Please note that the export procedure will take some time and the browser window must remain open until the export is completed.</span></div>
				<br>
				<div>
					<span style="font-weight: bold;" data-i18n="pageIdsExpTrg">Export target</span>:<br>
					<input type="radio" value="cloud" name="expTrg" id="expTrgCloud" checked="checked"><label for="expTrgCloud">Cloud</label>
					<input type="radio" value="server" name="expTrg" id="expTrgServer"><label for="expTrgServer">Server</label>
					<input type="radio" value="dc" name="expTrg" id="expTrgDC"><label for="expTrgDC">Data Center</label>
				</div>
				<div style="padding-bottom:4px;">
					<br><button id="exportBtn" disabled="disabled" class="aui-button aui-button-primary" data-i18n="startExp">Start Export</button>
					<img id="busyIcon" src="/images/spin.gif" style="display: none">
					<span id="idExportInfo"></span>
					<div id="idExportErrors" style="color: red"></div>
				</div>
				<textarea id="exportResult" style="width:800px; height: 300px"></textarea>
				<br><a id="pageIdsDownload" style="display: none; cursor: pointer;" data-i18n="download">Download</a>
		    </div>
		    <div class="tabs-pane" id="pageIdsImportTab">
		    	<div><br><span data-i18n="pageIdsImpInst1">After importing a space from another cloud/server instance or migrating from a cloud/server instance. Use "Page IDs Export" on that instance (the source), download the "pageIds.csv" file, then use this tool to complete the import process.</span><br><br>
				<span data-i18n="pageIdsImpInst2">Click "Start Import" button to upload the "pageIds.csv" file to this tool and start the import process. Please note that the import procedure will take some time and the browser window must remain open until the import is completed.</span></div>
				<div style="padding-bottom:4px;">
					<br>
				    <button id="importBtn" disabled="disabled" class="aui-button aui-button-primary" data-i18n="startImp">Start Import</button>
					<img id="PIBusyIcon" src="/images/spin.gif" style="display: none">
					<span id="idImportInfo"></span>
					<div id="idImportErrors" style="color: red"></div>
				</div>
				<div id="pageIdsImportLog"><br></div>
		    </div>
		    <div class="tabs-pane" id="reindexingTab">
			    <br>
			    <h4 data-i18n="refreshDrawIndex">Refresh draw.io Diagrams Index</h4>
				<div><br><span data-i18n="reindexInst1">Click the "Start Indexing" button to refresh draw.io diagrams index.</span><br>
				<span data-i18n="reindexInst2">Please note that the indexing procedure will take some time and the browser window must remain open until the indexing is completed.</span></div>
				<div><br><button id="indexBtn" disabled="disabled" class="aui-button aui-button-primary" data-i18n="startIndexing">Start Indexing</button>
					<img id="DRIbusyIcon" src="/images/spin.gif" style="display: none">
				</div>
				<div id="operationLog"><br></div>
			</div>
		</div>
	</body>
</html>
